<script lang="ts" setup>
import { useLocale } from '@/locale/locale';

defineProps<{
  checkInDate?: string;
  checkOutDate?: string;
  totalDays?: number;
}>();

const { t } = useLocale();
</script>

<template>
  <apt-section :title="t('LRKey_inOutTime')" custom-style="margin-bottom: 20rpx">
    <view class="flex justify-between">
      <view class="flex-1 mr-2">
        <view class="mb-1 text-base text-primary">
          {{ t('LTKey_tripCheckinDate') }}:
          {{ checkInDate }}
        </view>
        <view class="text-base text-primary">
          {{ t('LTKey_tripCheckoutDate') }}:
          {{ checkOutDate }}
        </view>
      </view>
      <view class="text-base text-primary">
        {{ t('TotalDays', { days: totalDays }) }}
      </view>
    </view>
  </apt-section>
</template>
